<template>
  <div class="wrap">
    <van-radio-group v-model="radio">
      <van-cell-group>
        <van-cell title="男" clickable @click="radio = '1'">
          <template #right-icon>
            <van-radio name="1" icon-size="16px" checked-color="#d5ad57" />
          </template>
        </van-cell>
        <van-cell title="女" clickable @click="radio = '2'">
          <template #right-icon>
            <van-radio name="2" icon-size="16px" checked-color="#d5ad57" />
          </template>
        </van-cell>
      </van-cell-group>
    </van-radio-group>
    <div class="btn-wrap" @click="onSubmit">
      <button class="btn">保存</button>
    </div>
  </div>
</template>

<script setup>
// import wx from 'weixin-js-sdk';
import { reactive, ref, onMounted, watch, computed } from 'vue'
import { showSuccessToast, showFailToast } from 'vant'
import { useRouter, useRoute } from 'vue-router'
import { postData } from '@/request/request.js'
let router = useRouter()
let route = useRoute()
let query = route.query
localStorage.setItem('user_id', query.user_id)
localStorage.setItem('access_token', query.access_token)
localStorage.setItem('open_id', query.open_id)
localStorage.setItem('currentPath', query.currentPath)

const radio = ref()

let init = () => {
  postData('/user/info/get', {})
    .then((res) => {
      radio.value = res?.datas?.gender.toString()
      console.log(radio.value) //2
    })
    .catch((err) => {
      console.log(err)
    })
}

let onSubmit = () => {
  console.log(radio.value)
  let user_id = localStorage.getItem('user_id')
  if (!user_id) {
    Toast.fail('请先绑定手机号')
    setTimeout(() => {
      uni.navigateTo({
        url: '/pages/loginPhone/loginPhone',
      })
    }, 1000)
  } else {
    postData('/user/info/update', { gender: radio.value })
      .then((res) => {
        showSuccessToast('保存成功')
        //init()
        setTimeout(() => {
          wx &&
            wx.miniProgram.navigateTo({
              url: '/pagesC/myInfo/index',
            })
        }, 2000)
      })
      .catch((err) => {
        showFailToast('保存失败')
      })
  }
}

onMounted(() => {
  init()
})

watch(
  () => route.fullPath,
  () => {
    init()
  }
)
</script>

<style scoped>
.wrap {
  font-size: 0.16rem;
  color: #333;
}
.van-cell {
  font-size: 0.16rem !important;
}
.btn-wrap {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.3rem;
}

.btn-wrap .btn {
  border: none;
  width: 90%;
  height: 0.35rem;
  line-height: 0.35rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.08rem;
  color: #533504;
  background: linear-gradient(to right, #c8a357, #fbde94, #c8a357);
  font-size: 0.16rem;
}
</style>
